<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>实例</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>

  <div id="app">

      <div>{{a}}</div>

  </div>

<script>
    var data={a: 1,};
   // Object.freeze(data);   //如果使用这个方法更新也不会实时更新视图
    var app =new Vue({
      el:"#app",
        data: data,
        //生命周期  钩子函数  现在用mounted用的比较多
        created(){
            console.log("created。。。。。。");
        }

    });
    console.log(data.a==app.a);
    data.a=99;
    console.log(app.a);
    app.a=88;
    console.log(data.a);
    data.b=77;//不会影响视图的更新
    /*app.$el得到元素的id   */
    console.log(app.$el == document.getElementById("app"));
    /*app.$data 得到vue的data的数据*/
    console.log(app.$data ==data);



</script>

</body>
</html>